<!doctype html>
<html lang="en" data-bs-theme="auto">
  <head><script src="../assets/js/color-modes.js"></script>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>订单列表</title>

    <link rel="canonical" href="https://getbootstrap.com/docs/5.3/examples/dashboard/">

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@docsearch/css@3">

    <link href="../assets/dist/css/bootstrap.min.css" rel="stylesheet">

    <style>
  

      .bi {
        vertical-align: -.125em;
        fill: currentColor;
      }

   

     
    </style>

    <!-- Custom styles for this template -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.min.css" rel="stylesheet">
    <!-- Custom styles for this template -->
    <link href="dashboard.css" rel="stylesheet">
  </head>
  <body>

    <svg xmlns="http://www.w3.org/2000/svg" class="d-none">
  
      <symbol id="list" viewBox="0 0 16 16">
        <path fill-rule="evenodd"
          d="M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5z" />
      </symbol>
    
    </svg>

    <header class="navbar sticky-top bg-dark flex-md-nowrap p-0 shadow" data-bs-theme="dark">
      <a class="navbar-brand col-md-3 col-lg-2 me-0 px-3 fs-6 text-white" href="#">个人中心-H5</a>

      <!-- 移动端菜单 -->
      <ul class="navbar-nav flex-row d-md-none">
        <li class="nav-item text-nowrap">
          <button class="nav-link px-3 text-white" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu" aria-controls="sidebarMenu"
            aria-expanded="false" aria-label="Toggle navigation">
            <svg class="bi"><use xlink:href="#list" /></svg>
          </button>
        </li>
      </ul>

    </header>

    <div class="container-fluid">
      <div class="row">
        <div class="sidebar border border-right col-md-3 col-lg-2 p-0 bg-body-tertiary">
          <div class="offcanvas-md offcanvas-end bg-body-tertiary" tabindex="-1" id="sidebarMenu" aria-labelledby="sidebarMenuLabel">
            <div class="offcanvas-header">
              <h5 class="offcanvas-title" id="sidebarMenuLabel">个人中心-H5</h5>
              <button type="button" class="btn-close" data-bs-dismiss="offcanvas" data-bs-target="#sidebarMenu" aria-label="Close"></button>
            </div>
            <div class="offcanvas-body d-md-flex flex-column p-0 pt-lg-3 overflow-y-auto">
              <ul class="nav flex-column">
                <li class="nav-item">
                  <a class="nav-link d-flex align-items-center gap-2" aria-current="page" href="#">
                    <img class="home-page-icon" src="../image/home-page.png" alt="" srcset="" />
                     首页
                  </a>
                </li>
                <li class="nav-item">
                  <a class="nav-link d-flex align-items-center gap-2 active" href="#">
                    <img class="personal-center-icon" src="../image/personal-center.png" alt="" srcset="" />
                    个人中心
                    <a href="" class=""></a>
                  </a>
                </li>
              </ul>
             
             
            </div>
          </div>
        </div>

        <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4 content-background">
          <div class="dropdown-control-content">
            <select class="form-control pull-down-width" id="exampleselectGender">
              <option disabled selected>订单类型</option>
              <option>全部</option>
              <option>订房</option>
              <option>汽车租赁</option>
              <option>酒水</option>
              <option>其它</option>
            </select>
            <select class="form-control pull-down-width" id="exampleselectGender">
              <option disabled selected>订单状态</option>
              <option>全部</option>
              <option>订房</option>
              <option>汽车租赁</option>
              <option>酒水</option>
              <option>其它</option>
            </select>
          </div>
          <div class="row order-card">
            <div class="col-md-6 grid-margin stretch-card card-spacing-below">
              <div class="card order-card-line">
                <div class="card-body card-body-spacing">
                  <div class="card-body-title">
                    <div class="order-number">订单号：SD1245632456621744</div>
                    <div class="pending-processing">待处理</div>
                  </div>
                  <div class="card-body-content">
                    <div class="type-title">
                      <div class="type-title-left">
                        <img class="type-title-icon" src="../image/reservation-icon.png" alt="" srcset="" />
                        <div class="type-title-left-text">订房-长沙梅溪湖豪生酒店</div>
                      </div>
                      <div class="price-text">￥298</div>
                    </div>
                    <div class="describe-content">12-28入住至 01-03离店，1间1晚-悦眠大床房</div>
                    <div class="customer-information">客户：李靓仔，邮箱：LLZ245621@163.com</div>
                    <div class="order-time">2024-12-10  9:40</div>
                    <div class="profit-price">
                      <div class="profit-price-text">利润价：￥168</div>
                      <div class="confirm-button-content">
                        <button class="confirm-button" type="button">去确认</button>
                     </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-md-6 grid-margin stretch-card card-spacing-below">
              <div class="card order-card-line">
                <div class="card-body card-body-spacing">
                  <div class="card-body-title">
                    <div class="order-number">订单号：TY1245632456621845</div>
                    <div class="in-progress">进行中</div>
                  </div>
                  <div class="card-body-content">
                    <div class="type-title">
                      <div class="type-title-left">
                        <img class="type-title-icon" src="../image/car-rental.png" alt="" srcset="" />
                        <div class="type-title-left-text">汽车租赁-长沙奇瑞4S店瑞虎7</div>
                      </div>
                      <div class="price-text">￥698</div>
                    </div>
                    <div class="describe-content">12月19日09:30-12月21日 23:11 共2天14小时</div>
                    <div class="customer-information">客户：李靓仔，邮箱：LLZ245621@163.com</div>
                    <div class="order-time">2024-12-10  9:40</div>
                    <div class="profit-price">
                      <div class="profit-price-text">利润价：￥188</div>
                      <div class="confirm-button-content">
                         <!-- <button class="confirm-button" type="button">去确认</button> -->
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-md-6 grid-margin stretch-card card-spacing-below">
              <div class="card order-card-line">
                <div class="card-body card-body-spacing">
                  <div class="card-body-title">
                    <div class="order-number">订单号：TY1245632456621845</div>
                    <div class="completed">已完成</div>
                  </div>
                  <div class="card-body-content">
                    <div class="type-title">
                      <div class="type-title-left">
                        <img class="type-title-icon" src="../image/drinks-icon.png" alt="" srcset="" />
                        <div class="type-title-left-text">酒水-普罗塞克起泡白葡萄酒</div>
                      </div>
                      <div class="price-text">￥188</div>
                    </div>
                    <div class="describe-content">Member's Mark 意大利进口 普罗塞克起泡白葡萄酒 750ml</div>
                    <div class="customer-information">客户：李靓仔，邮箱：LLZ245621@163.com</div>
                    <div class="order-time">2024-12-10  9:40</div>
                    <div class="profit-price">
                      <div class="profit-price-text">利润价：￥99</div>
                      <div class="confirm-button-content">
                         <!-- <button class="confirm-button" type="button">去确认</button> -->
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-md-6 grid-margin stretch-card card-spacing-below">
              <div class="card order-card-line">
                <div class="card-body card-body-spacing">
                  <div class="card-body-title">
                    <div class="order-number">订单号：TY1245632456621845</div>
                    <div class="completed">已完成</div>
                  </div>
                  <div class="card-body-content">
                    <div class="type-title">
                      <div class="type-title-left">
                        <img class="type-title-icon" src="../image/drinks-icon.png" alt="" srcset="" />
                        <div class="type-title-left-text">酒水-普罗塞克起泡白葡萄酒</div>
                      </div>
                      <div class="price-text">￥188</div>
                    </div>
                    <div class="describe-content">Member's Mark 意大利进口 普罗塞克起泡白葡萄酒 750ml</div>
                    <div class="customer-information">客户：李靓仔，邮箱：LLZ245621@163.com</div>
                    <div class="order-time">2024-12-10  9:40</div>
                    <div class="profit-price">
                      <div class="profit-price-text">利润价：￥99</div>
                      <div class="confirm-button-content">
                         <!-- <button class="confirm-button" type="button">去确认</button> -->
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="page-number-content">
            <nav>
              <ul class="pagination pagination-style-content">
                <li class="page-item"><a class="page-link page-link-style" href="#"><img class="previous-page" src="../image/previous-page.png" alt="" srcset="" /></a></li>
                <li class="page-item active"><a class="page-link page-link-style" href="#">1</a></li>
                <li class="page-item"><a class="page-link page-link-style" href="#">2</a></li>
                <li class="page-item"><a class="page-link page-link-style" href="#">...</a></li>
                <li class="page-item"><a class="page-link page-link-style" href="#"><img class="next-page" src="../image/next-page.png" alt="" srcset="" /></a></li>
                <li class="jump-to">共24页，跳转至</li>
                <li>
                  <input type="text" class="form-control input-jump-style" id="exampleInputUsername1" placeholder="10">
                </li>
                <li class="page-item">页</li>
              </ul>
            </nav>
            
          </div>
        </main>
      </div>
    </div>
    <script src="../assets/dist/js/bootstrap.bundle.min.js"></script>

</body>
</html>
